/* Element Plus 组件自定义样式 */

/* 按钮组件 */
.el-button {
  border-radius: var(--border-radius-base);
  font-weight: var(--font-weight-medium);
  transition: all var(--transition-base);
}

.el-button--primary {
  background: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
}

.el-button--primary:hover,
.el-button--primary:focus {
  background: var(--primary-light) !important;
  border-color: var(--primary-light) !important;
  transform: translateY(-1px);
  box-shadow: var(--shadow-light);
}

.el-button.btn-gradient {
  background: var(--gradient-primary);
  border: none;
}

.el-button.btn-gradient:hover {
  background: var(--gradient-primary);
  transform: translateY(-1px);
  box-shadow: var(--shadow-base);
}

/* 输入框组件 */
.el-input__wrapper {
  border-radius: var(--border-radius-base);
  transition: all var(--transition-base);
  box-shadow: var(--shadow-light);
}

.el-input__wrapper:hover {
  box-shadow: var(--shadow-base);
}

.el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px var(--primary-color) inset;
}

/* 卡片组件 */
.el-card {
  border-radius: var(--border-radius-large);
  box-shadow: var(--shadow-card);
  border: 1px solid var(--border-extra-light);
  transition: all var(--transition-base);
}

.el-card:hover {
  box-shadow: var(--shadow-base);
  transform: translateY(-2px);
}

.el-card__header {
  background: var(--bg-page);
  border-bottom: 1px solid var(--border-extra-light);
  font-weight: var(--font-weight-semibold);
}

/* 表格组件 */
.el-table {
  border-radius: var(--border-radius-base) !important;
  overflow: hidden;
  color: var(--text-regular) !important;
}

.el-table th.el-table__cell {
  background: var(--bg-page) !important;
  color: var(--text-primary) !important;
  font-weight: var(--font-weight-semibold) !important;
}

.el-table td.el-table__cell {
  color: var(--text-regular) !important;
}

.el-table tr:hover > td {
  background-color: var(--primary-extra-light) !important;
}

.el-table .el-table__empty-text {
  color: var(--text-secondary) !important;
}

/* 分页组件 */
.el-pagination {
  justify-content: center;
}

.el-pagination .el-pager li {
  border-radius: var(--border-radius-small);
  margin: 0 2px;
  transition: all var(--transition-base);
}

.el-pagination .el-pager li:hover {
  transform: translateY(-1px);
}

.el-pagination .el-pager li.is-active {
  background: var(--primary-color);
  color: white;
}

/* 标签组件 */
.el-tag {
  border-radius: var(--border-radius-small);
  font-weight: var(--font-weight-medium);
}

.el-tag--primary {
  background: var(--primary-extra-light);
  border-color: var(--primary-lighter);
  color: var(--primary-color);
}

/* 对话框组件 */
.el-dialog {
  border-radius: var(--border-radius-large) !important;
  box-shadow: var(--shadow-dark) !important;
}

.el-dialog__header {
  background: var(--bg-page) !important;
  border-bottom: 1px solid var(--border-extra-light) !important;
  border-radius: var(--border-radius-large) var(--border-radius-large) 0 0 !important;
}

.el-dialog__title {
  font-weight: var(--font-weight-semibold) !important;
  color: var(--text-primary) !important;
}

.el-dialog__body {
  color: var(--text-regular) !important;
}

/* 选择器组件 */
.el-select .el-input__wrapper {
  border-radius: var(--border-radius-base);
}

.el-select-dropdown {
  border-radius: var(--border-radius-base);
  box-shadow: var(--shadow-base);
  border: 1px solid var(--border-light);
}

.el-select-dropdown__item:hover {
  background: var(--primary-extra-light);
  color: var(--primary-color);
}

.el-select-dropdown__item.is-selected {
  background: var(--primary-color);
  color: white;
}

/* 上传组件 */
.el-upload-dragger {
  border-radius: var(--border-radius-base);
  border: 2px dashed var(--border-base);
  transition: all var(--transition-base);
}

.el-upload-dragger:hover {
  border-color: var(--primary-color);
  background: var(--primary-extra-light);
}

.el-upload-dragger .el-icon {
  color: var(--primary-color);
}

/* 警告框组件 */
.el-alert {
  border-radius: var(--border-radius-base);
  border: none;
  box-shadow: var(--shadow-light);
}

.el-alert--info {
  background: var(--primary-extra-light);
  color: var(--primary-color);
}

.el-alert__icon {
  color: var(--primary-color);
}

/* 标签页组件 */
.el-tabs--border-card {
  border: 1px solid var(--border-extra-light);
  border-radius: var(--border-radius-large);
  box-shadow: var(--shadow-card);
}

.el-tabs--border-card > .el-tabs__header {
  background: var(--bg-page);
  border-bottom: 1px solid var(--border-extra-light);
  border-radius: var(--border-radius-large) var(--border-radius-large) 0 0;
}

.el-tabs--border-card > .el-tabs__header .el-tabs__item {
  border: none;
  color: var(--text-regular);
  font-weight: var(--font-weight-medium);
  transition: all var(--transition-base);
}

.el-tabs--border-card > .el-tabs__header .el-tabs__item:hover {
  color: var(--primary-color);
}

.el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
  color: var(--primary-color);
  background: white;
}

/* 表单组件 */
.el-form-item__label {
  font-weight: var(--font-weight-medium) !important;
  color: var(--text-primary) !important;
}

.el-form-item.is-error .el-input__wrapper {
  box-shadow: 0 0 0 1px var(--danger-color) inset !important;
}

.el-form-item.is-error .el-form-item__error {
  color: var(--danger-color) !important;
}

/* 输入框文本颜色 */
.el-input__inner {
  color: var(--text-primary) !important;
}

.el-input__inner::placeholder {
  color: var(--text-placeholder) !important;
}

.el-textarea__inner {
  color: var(--text-primary) !important;
}

.el-textarea__inner::placeholder {
  color: var(--text-placeholder) !important;
}

/* 菜单组件 */
.el-menu {
  border-radius: var(--border-radius-base);
}

.el-menu-item {
  border-radius: var(--border-radius-small);
  margin: 2px 8px;
  transition: all var(--transition-base);
}

.el-menu-item:hover {
  background: var(--primary-extra-light);
  color: var(--primary-color);
}

.el-menu-item.is-active {
  background: var(--primary-color);
  color: white;
}

/* 下拉菜单组件 */
.el-dropdown-menu {
  border-radius: var(--border-radius-base);
  box-shadow: var(--shadow-base);
  border: 1px solid var(--border-light);
  padding: var(--spacing-xs);
}

.el-dropdown-menu__item {
  border-radius: var(--border-radius-small);
  transition: all var(--transition-base);
  font-weight: var(--font-weight-medium);
}

.el-dropdown-menu__item:hover {
  background: var(--primary-extra-light);
  color: var(--primary-color);
}

/* 评分组件 */
.el-rate {
  display: flex;
  align-items: center;
}

.el-rate__item {
  margin-right: 2px;
}

.el-rate__icon {
  color: var(--warning-color);
}

/* 骨架屏组件 */
.el-skeleton__item {
  background: linear-gradient(90deg, var(--border-extra-light) 25%, var(--border-lighter) 37%, var(--border-extra-light) 63%);
  border-radius: var(--border-radius-small);
}

/* 消息提示组件 */
.el-message {
  border-radius: var(--border-radius-base) !important;
  box-shadow: var(--shadow-base) !important;
  border: none !important;
}

.el-message--success {
  background: var(--success-color) !important;
  color: white !important;
}

.el-message--success .el-message__content {
  color: white !important;
}

.el-message--warning {
  background: var(--warning-color) !important;
  color: white !important;
}

.el-message--warning .el-message__content {
  color: white !important;
}

.el-message--error {
  background: var(--danger-color) !important;
  color: white !important;
}

.el-message--error .el-message__content {
  color: white !important;
}

.el-message--info {
  background: var(--primary-color) !important;
  color: white !important;
}

.el-message--info .el-message__content {
  color: white !important;
}

/* 通知组件 */
.el-notification {
  border-radius: var(--border-radius-large);
  box-shadow: var(--shadow-dark);
  border: 1px solid var(--border-light);
}

/* 加载组件 */
.el-loading-mask {
  background-color: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(4px);
}

.el-loading-spinner .circular {
  color: var(--primary-color);
}

/* 步骤条组件 */
.el-steps .el-step__icon {
  border-radius: var(--border-radius-round);
}

.el-steps .el-step__icon.is-text {
  background: var(--primary-color);
  color: white;
}

/* 时间线组件 */
.el-timeline-item__node {
  border-radius: var(--border-radius-round);
}

.el-timeline-item__node--primary {
  background: var(--primary-color);
}

/* 进度条组件 */
.el-progress-bar__outer {
  border-radius: var(--border-radius-small);
  background: var(--border-extra-light);
}

.el-progress-bar__inner {
  border-radius: var(--border-radius-small);
  background: var(--gradient-primary);
}

/* 滑块组件 */
.el-slider__runway {
  border-radius: var(--border-radius-small);
  background: var(--border-extra-light);
}

.el-slider__bar {
  border-radius: var(--border-radius-small);
  background: var(--primary-color);
}

.el-slider__button {
  border: 2px solid var(--primary-color);
  background: white;
  box-shadow: var(--shadow-light);
}

/* 开关组件 */
.el-switch {
  border-radius: var(--border-radius-large);
}

.el-switch.is-checked .el-switch__core {
  background: var(--primary-color);
}

/* 头像组件 */
.el-avatar {
  box-shadow: var(--shadow-light);
  transition: all var(--transition-base);
}

.el-avatar:hover {
  box-shadow: var(--shadow-base);
  transform: scale(1.05);
}

/* 通用文本颜色修复 */
.el-text {
  color: var(--text-regular) !important;
}

.el-descriptions__label {
  color: var(--text-primary) !important;
}

.el-descriptions__content {
  color: var(--text-regular) !important;
}

.el-card__body {
  color: var(--text-regular) !important;
}

.el-card__header {
  color: var(--text-primary) !important;
}

/* 分页组件文本颜色 */
.el-pagination .el-pagination__total,
.el-pagination .el-pagination__jump {
  color: var(--text-regular) !important;
}

.el-pagination .btn-prev,
.el-pagination .btn-next {
  color: var(--text-regular) !important;
}

/* 标签页文本颜色 */
.el-tabs__item {
  color: var(--text-regular) !important;
}

.el-tabs__item.is-active {
  color: var(--primary-color) !important;
}

/* 复选框和单选框文本颜色 */
.el-checkbox__label,
.el-radio__label {
  color: var(--text-regular) !important;
}

/* 步骤条文本颜色 */
.el-step__title {
  color: var(--text-primary) !important;
}

.el-step__description {
  color: var(--text-secondary) !important;
} 